<template>
    <div class="m-crumbs">
        <el-breadcrumb separator=">">
            <el-breadcrumb-item :to="{ path: '/' }">{{ $store.state.geo.position.city.replace('市','') }}美团</el-breadcrumb-item>
            <el-breadcrumb-item><a href="/">{{ $store.state.geo.position.city.replace('市','') }}{{ decodeURIComponent(keyword) }}</a></el-breadcrumb-item>
        </el-breadcrumb>
    </div>
</template>

<script>
export default {
    props: {
        keyword: {
            type: String,
            default: ''
        }
    }
}
</script>

<style lang="scss">
    .m-crumbs {
        width: 1190px;
        height: 21px;
        .el-breadcrumb {
            text-decoration: none;
            font-size: 12px;
            color: #222;
            margin: 10px 0 0 0;
            .el-breadcrumb__item {
                 .is-link {
                    font-weight: normal;
                    &:hover {
                        color: #13D1BE;
                    }
                }
                .el-breadcrumb__separator {
                    margin: 0 3px;
                    color: #222;
                }
               
                a {
                    color: #222;
                    &:hover {
                        color: #13D1BE;
                        cursor: pointer;
                    }
                }
            }
        }
    }
</style>


